@extends('admin.main')
@section('head')
    <link href="/static/datetimepicker/css/datetimepicker.css" rel="stylesheet" type="text/css">
    @if(C('COLOR_STYLE')=='blue_color')
        <link href="/static/datetimepicker/css/datetimepicker_blue.css" rel="stylesheet" type="text/css">'@endif
    <link href="/static/datetimepicker/css/dropdown.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="/static/datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
    <script type="text/javascript" src="/static/datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"
            charset="UTF-8"></script>
    <style>
        .ncsc-default-table {
            line-height: 20px;
            width: 100%;
            border-collapse: collapse;
            clear: both;
        }

        tbody {
            display: table-row-group;
            vertical-align: middle;
            border-color: inherit;
        }

        thead {
            display: table-header-group;
            vertical-align: middle;
            border-color: inherit;
        }

        tr {
            display: table-row;
            vertical-align: inherit;
            border-color: inherit;
        }

        .ncsc-default-table thead th {
            line-height: 20px;
            /*color: #999;*/
            /*background-color: #FFF;*/
            text-align: center;
            height: 20px;
            padding: 8px 0;
            border-bottom: solid 1px #DDD;
        }

        .w10 {
            width: 10px;
        }

        .w100 {
            width: 100px !important;
        }

        .w40 {
            width: 40px !important;
        }

        .w60 {
            width: 60px !important;
        }

        .w90 {
            width: 90px;
        }

        .w120 {
            width: 120px !important;
        }

        .order tbody tr td.sep-row {
            height: 12px;
            padding: 0;
            border: 0;
        }

        .order tbody tr td.sep-row {
            height: 12px;
            padding: 0;
            border: 0;
            background-color: #F6F6F6;
        }

        .order tbody tr th {
            border: solid 1px #DDD;
        }

        .order tbody tr th h3 {
            font-size: 12px;
            line-height: 20px;
            font-weight: bold;
            color: #555;
            vertical-align: middle;
            display: inline-block;
            margin: 0 10px;
        }

        .order tbody tr th time {
            font-size: 11px;
            line-height: 20px;
            color: #999;
            vertical-align: middle;
            display: inline-block;
            margin-right: 20px;
            -webkit-text-size-adjust: none;
        }

        .order tbody tr th time i {
            font-size: 12px;
            margin-right: 4px;
        }

        .order tbody tr td {
            border-bottom: 1px solid #E6E6E6;
            vertical-align: top;
        }

        .order tbody tr td.bdl {
            border-left: 1px solid #E6E6E6;
        }

        .order tbody tr td.bdr {
            border-right: 1px solid #E6E6E6;
        }

        .order .norecord {
            border-bottom: 0 !important;
        }

        .order .buyer {
            color: #555;
            position: relative;
            display: block;
        }

        .order .buyer-info {
            display: none;
        }

        .order .buyer:hover .buyer-info {
            *width: 250px /*IE7*/;
            display: block;
            position: absolute;
            z-index: 8;
            top: -40px;
            left: 90px;
            border: solid 1px #FEC500;
            background-color: #FFF9D4;
            padding: 4px;
            border-radius: 5px;
        }

        .order .buyer-info em {
            width: 8px;
            height: 14px;
            position: absolute;
            z-index: 9;
            top: 37px;
            left: -8px;
        }

        .order .buyer-info .con {
            display: block;
            overflow: hidden;
            background: #FFF;
            padding: 5px;
        }

        .order .buyer-info h3 {
            font-size: 1em;
            font-weight: 700;
            color: #C33700;
            padding: 5px 0;
            overflow: hidden;
        }

        .order .buyer-info h3 i {
            width: 17px;
            height: 11px;
            float: left;
            margin: 5px 5px 4px 12px;
        }

        .order .buyer-info h3 span {
            float: left;
        }

        .order .buyer-info dl {
            color: #777;
            padding: 2px 0;
            width: 220px;
            overflow: hidden;
            clear: both;
        }

        .order .buyer-info dt {
            float: left;
            width: 50px;
            text-align: right;
        }

        .order .buyer-info dd {
            float: left;
            width: 140px;
            text-align: left;
        }

        .ncsc-default-table tbody th span {
            display: inline-block;
            vertical-align: middle;
            margin-right: 30px;
        }

        .ml10 {
            margin-left: 10px !important;
        }

        .ncsc-default-table tbody th span {
            display: inline-block;
            vertical-align: middle;
            margin-right: 30px;
        }

        /* 隔行变色 行默认颜色 */
        .table-striped tbody tr {
            background-color: #f2f2f2;
            color: #686868;
        }

        /* 隔行变色 偶数行配色 */
        .table-striped tbody tr:nth-child(even) {
            background-color: #fefefe;

        }

        .order tbody tr th {
            border: solid 1px #DDD;
        }

        .ncsc-default-table tbody th {
            background-color: #FAFAFA;
            border: solid #E6E6E6;
            border-width: 1px 0;
            padding: 4px 0;
        }

        caption, th {
            text-align: left;
        }

        i, cite, em {
            font-size: 1em;
            font-style: normal;
            font-weight: normal;
        }

        .ncsc-default-table tbody td {
            color: #999;
            background-color: #FFF;
            text-align: center;
            padding: 10px 0;
        }

        .order tbody tr td.bdl {
            border-left: 1px solid #E6E6E6;
        }

        .order tbody tr td {
            border-bottom: 1px solid #E6E6E6;
            vertical-align: top;
        }

        .ncsc-order-amount {
            font: bold 12px/20px Verdana;
            color: #C00;
        }

        a.ncbtn-bluejeansjeans {
            background-color: #5D9CEC;
        }

        a.ncbtn-greenjeansjeans {
            background-color: green;
        }

        a.ncbtn-mini {
            line-height: 16px;
            height: 16px;
            padding: 3px 7px;
            border-radius: 2px;
        }

        a.ncbtn-mini, a.ncbtn {
            font: normal 12px/20px "microsoft yahei", arial;
            color: #FFF;
            background-color: #CCD0D9;
            text-align: center;
            vertical-align: middle;
            display: inline-block;
            height: 20px;
            padding: 5px 10px;
            border-radius: 3px;
            cursor: pointer;
        }

        .order tbody tr td.bdr {
            border-right: 1px solid #E6E6E6;
        }

        .order tbody tr td.bdl {
            border-left: 1px solid #E6E6E6;
        }

        .order tbody tr td {
            border-bottom: 1px solid #E6E6E6;
            vertical-align: top;
        }

        .ncsc-default-table tbody td {
            color: #999;
            background-color: #FFF;
            text-align: center;
            padding: 10px 0;
        }

        a.ncbtn-grapefruit {
            background-color: #ED5564;
        }

        a.ncbtn {
            height: 16px;
            padding: 5px 10px;
            border-radius: 3px;
        }

        a.ncbtn-bluejeansjeans {
            background-color: #5D9CEC;
        }

        a.ncbtn-mini {
            line-height: 16px;
            height: 16px;
            padding: 3px 7px;
            border-radius: 2px;
        }
    </style>
    @if(isset($hideHeader))
        <style>
            body {
                padding: 0;
            }
        </style>
    @endif
@endsection
@section('body')
    <!-- 标题栏 -->
    <div class="main-title">
        <h2>订单列表 [ <span style="color: red">{{$listType[request('type',0)]}} </span> ]</h2>
    </div>
    <div class="cf">
        <div class="fl">
            <a class="btn" href="{{urlPlat('single','getOrder',['type'=>1])}}">超 时</a>
            <a class="btn" href="{{urlPlat('single','getOrder',['type'=>3])}}">待接单</a>
            <a class="btn" href="{{urlPlat('single','getOrder',['type'=>4])}}">配送中</a>
            <a class="btn" href="{{urlPlat('single','getOrder',['type'=>5])}}">已完成</a>
            <a class="btn" href="{{urlPlat('single','getOrder',['type'=>2])}}">未付款</a>
        </div>
        <!-- 高级搜索 -->
        <div class="search-form fr cf">
            <div class="sleft">
                <input type="text" name="keyword" class="search-input" value="{{request('keyword')}}"
                       placeholder="请输入订单号">
                <a class="sch-btn" href="javascript:;" id="search" url="{{urlPlat('single','getOrder')}}"><i
                            class="btn-search"></i></a>
            </div>
            <div class="btn-group-click adv-sch-pannel fr">
                <button class="btn">高 级<i class="btn-arrowdown"></i></button>
                <div class="dropdown cf">
                    <div class="row">
                        <label>下单时间：</label>
                        <input type="text" id="time-start" name="time-start" class="text input-2x"
                               value="{{request('time-start')}}" placeholder="起始时间"/> -
                        <input type="text" id="time-end" name="time-end" class="text input-2x"
                               value="{{request('time-end')}}" placeholder="结束时间"/>
                    </div>
                    <div class="row">
                        <label>买家：</label>
                        <input type="text" name="buyer_name" class="text input-2x" value="{{request('buyer_name')}}"
                               placeholder="请输入买家姓名">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 数据列表 -->
    <div class="data-table table-striped">
        <table class="ncsc-default-table order">
            <thead>
            <tr>
                <th class="w10"></th>
                <th colspan="2">商品</th>
                <th class="w100">单价（元）</th>
                <th class="w40">数量</th>
                <th class="w100">买家</th>
                <th class="w100">订单金额</th>
                <th class="w40">订水数量</th>
                <th class="w40">回桶数量</th>
                <th class="w90">交易状态</th>
                <th class="w40">配送员</th>
                @if(plat_identify() == 'account')
                    <th class="w120">交易操作</th>@endif
            </tr>
            </thead>
            @if(count($rows['data']))
                @foreach($rows['data'] as $v)
                    <tbody id="row_{{$v['id']}}">
                    <tr>
                        <td colspan="20" class="sep-row"></td>
                    </tr>
                    <tr>
                        <th colspan="20">
                            <span class="ml10">订单编号：<em>{{$v['order_sn']}}</em><i class="icon-mobile-phone"></i></span>
                            <span>下单时间：<em class="goods-time">{{$v['created_at']}}</em></span>
                        </th>
                    </tr>
                    <tr>
                        <td class="bdl"></td>
                        <td class="w120">
                            <div class="ncsc-goods-thumb">
                                <img src="/uploads/goods/imgs/{{$v['order_goods'][0]['admin_id']}}/{{$v['order_goods'][0]['goods_id']}}_1_{{$mini}}.{{$ext}}?{{time()}}">
                            </div>
                        </td>
                        <td class="tl" style="width: 45%">
                            <dl class="goods-name">
                                <dt style="color:#333;">{{$v['order_goods'][0]['goods_name']}}</dt>
                            </dl>
                        </td>
                        <td><p>{{$v['order_goods'][0]['goods_price']}}</p></td>
                        <td>x {{$v['order_goods'][0]['goods_num']}}</td>
                        <td class="bdl" rowspan="{{count($v['order_goods'])}}">
                            <div class="buyer">{{$v['buyer_name']}}
                                <p member_id="{{$v['buyer_id']}}"></p>
                                <div class="buyer-info">
                                    <em></em>
                                    <div class="con">
                                        <h3><i></i><span>联系信息</span></h3>
                                        <dl>
                                            <dt>姓名：</dt>
                                            <dd>{{$v['buyer_name']}}</dd>
                                        </dl>
                                        <dl>
                                            <dt>电话：</dt>
                                            <dd>{{$v['mobile']}}</dd>
                                        </dl>
                                        <dl>
                                            <dt>地址：</dt>
                                            <dd>{{$v['buyer_address']}}</dd>
                                        </dl>
                                    </div>
                                </div>
                            </div>
                        </td>
                        <td class="bdl bdr" rowspan="{{count($v['order_goods'])}}">
                            <p class="ncsc-order-amount">{{$v['order_amount']}}</p>
                            @if($v['type'] == 1)
                                <p class="goods-pay" title="支付方式：货到付款" style="color:orange">货到付款</p>
                            @elseif($v['type'] == 0 && $v['bill_id'] == 0)
                                <p class="goods-pay" title="支付方式：微信支付" style="color:green">微信支付</p>
                            @elseif($v['type'] == 0 && $v['bill_id'] != 0)
                                <p class="goods-pay" title="支付方式：水票支付" style="color:blue">水票支付</p>
                            @endif
                        </td>
                        <td class="w60 bdr" rowspan="{{count($v['order_goods'])}}">{{$v['bucket_num']}}</td>
                        <td class="w60 bdr" rowspan="{{count($v['order_goods'])}}">{{$v['back_bucket_num']}}</td>
                        <td class="bdl bdr" rowspan="{{count($v['order_goods'])}}">
                            <p style="color:@if($v['status'] == 10) red @elseif($v['status'] == 20) blue  @else gray @endif">{{$v['status_text']}}</p>
                            {{--<p><a href="javascript:;">订单详情</a></p>--}}
                            <p style="color:@if($v['dispatch'] == -1) orange @endif">{{$v['dispatch_text']}}</p>
                        </td>
                        <td class="w60 bdr"
                            rowspan="{{count($v['order_goods'])}}">@if(isset($v['worker'])) {{$v['worker']['name']}} @else
                                --- @endif</td>
                        @if(plat_identify() == 'account')
                            <td class="bdl bdr" rowspan="{{count($v['order_goods'])}}">
                                @if($v['status'] == 10 && $v['dispatch'] <= 0)
                                    <p><a href="{{urlPlat('single','getOrderDelete',['id'=>$v['id']])}}"
                                          class="ncbtn-mini mt5 ajax-get">取消订单</a></p>
                                @endif
                                @if($v['status'] == 20 && $v['dispatch'] < 2 && $v['bill_id'])
                                    <p><a href="{{urlPlat('single','getOrderCancle',['id'=>$v['id'],'bill_id'=>$v['bill_id']])}}"
                                          class="ncbtn-mini mt5 ajax-get">取消订单</a></p>
                                @endif
                                    @if(($v['status'] >= 10 && $v['dispatch'] <= 0 && $v['type']) || ($v['status'] == 20 && $v['dispatch'] <= 0 && !$v['type']))
                                    <p style="padding-top: 5px;"><a href="javascript:void(0)"
                                                                    class="ncbtn-mini ncbtn-bluejeansjeans mt10"
                                                                    onclick="send('{{$v['id']}}','{{$v['shop_id']}}')">派送订单</a>
                                    </p>
                                @endif
                                @if($v['status'] >= 10 && $v['dispatch'] == 1)
                                    <p style="padding-top: 5px;"><a href="javascript:void(0)"
                                                                    class="ncbtn-mini ncbtn-grapefruit mt10"
                                                                    onclick="resend('{{$v['id']}}','{{$v['shop_id']}}')">改派订单</a>
                                    </p>
                                    <p style="padding-top: 5px;"><a href="javascript:void(0)"
                                                                    class="ncbtn-mini ncbtn-bluejeansjeans mt10"
                                                                    onclick="completeOrder('{{$v['id']}}','{{$v['shop_id']}}','{{$v['back']}}')">{{$v['back'] ? '回 桶' : '完成'}}</a>
                                    </p>
                                @endif
                            </td>
                        @endif
                    </tr>
                    @for ($i = 1; $i < count($v['order_goods']); $i++)
                        <tr>
                            <td class="bdl"></td>
                            <td class="w70">
                                <div class="ncsc-goods-thumb"><img
                                            src="/uploads/goods/imgs/{{$v['order_goods'][$i]['admin_id']}}/{{$v['order_goods'][$i]['goods_id']}}_1_{{$mini}}.{{$ext}}?{{time()}}">
                                </div>
                            </td>
                            <td class="tl">
                                <dl class="goods-name">
                                    <dt style="color:#333;">{{$v['order_goods'][$i]['goods_name']}}</dt>
                                </dl>
                            </td>
                            <td><p>{{$v['order_goods'][$i]['goods_price']}}</p></td>
                            <td>x {{$v['order_goods'][$i]['goods_num']}}</td>
                        </tr>
                    @endfor
                    </tbody>
                @endforeach
            @else
                <td colspan="12" class="text-center"> aOh! 暂时还没有内容!</td>
            @endif
        </table>
    </div>
    <div class="page">
        @if($rows['last_page']>1)
            <div>
                <a class="first"
                   href="{{urlPlat('single','getOrder',['page'=>1,'shop_id'=>request('shop_id')])}}&type={{request('type',0)}}">首页</a>
                @if($rows['prev_page_url'])
                    <a class="prev"
                       href="{{$rows['prev_page_url']}}&type={{request('type',0)}}&shop_id={{request('shop_id', 0)}}">
                        &lt;&lt;</a>
                @endif
                @if(count($rows['pageNoList']))
                    @foreach($rows['pageNoList'] as $v)
                        @if($rows['current_page'] == $v)
                            <span class="current">{{$v}}</span>
                        @else
                            <a class="num"
                               href="{{urlPlat('single','getOrder',['page'=>$v,'type'=>request('type',0),'shop_id'=>request('shop_id')])}}">{{$v}}</a>
                        @endif
                    @endforeach
                @endif
                @if($rows['next_page_url'])
                    <a class="next"
                       href="{{$rows['next_page_url']}}&type={{request('type',0)}}&shop_id={{request('shop_id', 0)}}">
                        &gt;&gt;</a>
                @endif
                <a class="last"
                   href="{{urlPlat('single','getOrder',['page'=>$rows['last_page'],'shop_id'=>request('shop_id')])}}&type={{request('type',0)}}">末页</a>
                <span class="rows">共 {{$rows['total']}} 条记录</span>
            </div>
        @endif
    </div>
@endsection

@section('script')
    <script type="text/javascript">

        function cancle(id) {
            layer.open({
                type: 2,
                title: '取消订单',
                area: ['600px', '200px'],
                fixed: false, //不固定
                maxmin: true,
                content: '{{urlPlat('single','getOrderCancle')}}?id=' + id
            });
        }

        function send(id, shop_id) {
            layer.open({
                type: 2,
                title: '派送订单',
                area: ['400px', '150px'],
                fixed: false, //不固定
                maxmin: true,
                content: '{{urlPlat('single','getOrderSend')}}?id=' + id + '&shop_id=' + shop_id
            });
        }

        function resend(id, shop_id) {
            layer.open({
                type: 2,
                title: '改派订单',
                area: ['400px', '150px'],
                fixed: false, //不固定
                maxmin: true,
                content: '{{urlPlat('single','getOrderSend')}}?id=' + id + '&shop_id=' + shop_id + '&re=1'
            });
        }

        function completeOrder(order_id, shop_id, back) {
            layer.open({
                type: 2,
                title: back == 1 ? '回桶' : '完成',
                area: ['400px', '600px'],
                fixed: false, //不固定
                maxmin: true,
                content: '{{urlPlat('single','getOrderComplete')}}?id=' + order_id + '&shop_id=' + shop_id + '&back=' + back
            });
        }

        //搜索功能
        $("#search").click(function () {
            var url = $(this).attr('url');
            var query = $('.search-form').find('input').serialize();
            query = query.replace(/(&|^)(\w*?\d*?\-*?_*?)*?=?((?=&)|(?=$))/g, '');
            query = query.replace(/^&/g, '');
            if (url.indexOf('?') > 0) {
                url += '&' + query;
            } else {
                url += '?' + query;
            }
            window.location.href = url;
        });

        //回车自动提交
        $('.search-form').find('input').keyup(function (event) {
            if (event.keyCode === 13) {
                $("#search").click();
            }
        });

        $('#time-start').datetimepicker({
            format: 'yyyy-mm-dd',
            language: "zh-CN",
            minView: 2,
            autoclose: true
        });

        $('#time-end').datetimepicker({
            format: 'yyyy-mm-dd',
            language: "zh-CN",
            minView: 2,
            autoclose: true
        });
    </script>
@endsection
